<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<script type="text/javascript" src="js/vue.min.js"></script>
	</head>

	<body>
		<div id="app">
			<p> {{num}} </p>
			
			<input type="button" @click="num++" value="递增" />
			
		</div>
	</body>
	<script type="text/javascript">
		var vm = new Vue({
			el: "#app",
			data: {
				num: 0
			},
			// 在程序初始化之前调用
			beforeCreate: function() {
				console.log('beforeCreate')
			},
			// 在程序初始化之后调用
			created: function() {
				console.log('created')
			},
			// 在标签绑定之前调用的函数
			beforeMount: function() {
				console.log('beforeMount')
			},
			// 在标签绑定之后调用的函数
			mounted: function() {
				console.log('mounted')
			},
			beforeUpdate:function(){
				console.log('beforeUpdate')
			},
			updated:function(){
				console.log('updated')
			}

		})
	</script>

</html>